import React, {Component} from 'react'
import {
    StyleSheet, Text,
    View, TouchableOpacity,
    Dimensions, Image,
} from 'react-native'
let {height, width} = Dimensions.get('window');
export default class shopheader extends Component {
    constructor(props) {
        super(props)
        this.state = {}
    }

    render() {
        return (
            <View style={style.shopheaderview}>
                <TouchableOpacity>
                    <Text>
                        福州
                    </Text>
                </TouchableOpacity>
                <TouchableOpacity style={style.shopheadersearch}>
                    <Image source={require('../../img/shop/search_icon.png')} style={style.shopheaderimage}/>
                    <Text style={style.shopheadertxt}>
                        福州
                    </Text>
                </TouchableOpacity>
                <TouchableOpacity>
                    <Image source={require('../../img/shop/icon_navigationItem_message_white@2x.png')}
                           style={style.shopheadermsgimage}/>
                </TouchableOpacity>
            </View>
        );
    }
}
const style = StyleSheet.create({
    shopheaderview: {
        flexDirection: 'row',
        height: 50,
        backgroundColor: '#999999',
        justifyContent: 'center',
        alignItems: 'center',
    },
    shopheadertxt:{
      marginLeft:5
    },
    shopheaderimage: {
        height: 20,
        width: 20,
    },
    shopheadermsgimage: {
        height: 20,
        width: 20,
        marginLeft:10,
    },
    shopheadersearch: {
        height: 30,
        borderRadius: 20,
        marginLeft: 10,
        width: width * 0.7,
        flexDirection: 'row',
        backgroundColor: '#fff',
        justifyContent: 'center',
        alignItems: 'center',
    },
});

module.exports = shopheader